<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>子代选择器</title>
    <!--
只想让div里的a变成红色,但是不想让div的p元素的a元素变成红色
也就是说只想让div的儿子变成红色,不想让他的所有后代都变成红色
我们这个时候就要用到子代选择器而不能使用后代选择器
div > a{} 表示div中的儿子a元素  >表示子代

我们在使用子代选择器时
可以使用元素选择器,类选择器,id选择器和各种复合选择器进行组合
格式 父元素>子元素{}
    -->
    <style>
        div > a {
            color: red;
        }

        div > p > a {
            color: gold;
        }

        .foot>a{
            color: chocolate;
        }
    </style>
</head>

<body>
<div>
    <a href="#">张三</a>
    <a href="#">李四</a>
    <a href="#">王五</a>
    <p>
        <a href="#">赵六</a>
        <div class="foot">
    <a href="#">孙七</a>
</div>
    </p>


</div>
</body>
</html>